<!DOCTYPE html>
<!--
This is a starter template page. Use this page to start your new project from
scratch. This page gets rid of all links and provides the needed markup only.
-->
<html lang="zhCN">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>综合服务</title>

  <!-- Google Font: Source Sans Pro -->
<!--  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">-->
  <!-- Font Awesome Icons -->
  <link rel="stylesheet" href="plugins/fontawesome-free/css/font-awesome.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="dist/css/adminlte.min.css">
</head>
<body class="hold-transition layout-top-nav">
<div class="wrapper">
  <!-- Navbar -->
  <nav class="main-header navbar navbar-expand-md navbar-light">
    <div class="row">
      <div class="logo-switch">
        <img src="dist/img/gl-logo.png" alt="logo">
      </div>
      <div class="nav-phone float-right">
        <p style="line-height: 30px;margin:0;float: left"><i class="fa fa-phone" style="font-size: 16px"></i> 服务热线：<span class="text-phone">12344442</span>学校总机：<span class="text-phone">55988 5565</span></p>
      </div>
    </div>
    <div class="container">
      <a href="" class="navbar-brand">
        <img src="" alt="" class="brand-image" style="opacity: .8">
        <span class="brand-text font-weight-light">学工管理系统</span>
      </a>

      <button class="navbar-toggler order-1" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>

      <div class="collapse navbar-collapse order-3 ml-3" id="navbarCollapse">
        <!-- Left navbar links -->
        <ul class="navbar-nav">
          <li class="nav-item">
            <a href="#" class="nav-link">首页</a>
          </li>
          <li class="nav-item">
            <a href="#" class="nav-link">基础信息</a>
          </li>
          <li class="nav-item">
            <a href="#" class="nav-link">应用中心</a>
          </li>
          <li class="nav-item">
            <a href="#" class="nav-link">综合服务</a>
          </li>
          <li class="nav-item">
            <a href="#" class="nav-link">系统管理</a>
          </li>

<!--          下拉菜单-->
<!--          <li class="nav-item dropdown">-->
<!--            <a id="dropdownSubMenu1" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="nav-link dropdown-toggle">Dropdown</a>-->
<!--            <ul aria-labelledby="dropdownSubMenu1" class="dropdown-menu border-0 shadow">-->
<!--              <li><a href="#" class="dropdown-item">Some action </a></li>-->
<!--              <li><a href="#" class="dropdown-item">Some other action</a></li>-->

<!--              <li class="dropdown-divider"></li>-->

<!--              &lt;!&ndash; Level two dropdown&ndash;&gt;-->
<!--              <li class="dropdown-submenu dropdown-hover">-->
<!--                <a id="dropdownSubMenu2" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="dropdown-item dropdown-toggle">Hover for action</a>-->
<!--                <ul aria-labelledby="dropdownSubMenu2" class="dropdown-menu border-0 shadow">-->
<!--                  <li>-->
<!--                    <a tabindex="-1" href="#" class="dropdown-item">level 2</a>-->
<!--                  </li>-->

<!--                  &lt;!&ndash; Level three dropdown&ndash;&gt;-->
<!--                  <li class="dropdown-submenu">-->
<!--                    <a id="dropdownSubMenu3" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="dropdown-item dropdown-toggle">level 2</a>-->
<!--                    <ul aria-labelledby="dropdownSubMenu3" class="dropdown-menu border-0 shadow">-->
<!--                      <li><a href="#" class="dropdown-item">3rd level</a></li>-->
<!--                      <li><a href="#" class="dropdown-item">3rd level</a></li>-->
<!--                    </ul>-->
<!--                  </li>-->
<!--                  &lt;!&ndash; End Level three &ndash;&gt;-->

<!--                  <li><a href="#" class="dropdown-item">level 2</a></li>-->
<!--                  <li><a href="#" class="dropdown-item">level 2</a></li>-->
<!--                </ul>-->
<!--              </li>-->
<!--              &lt;!&ndash; End Level two &ndash;&gt;-->
<!--            </ul>-->
<!--          </li>-->
        </ul>


        <form class="form-inline ml-0 ml-md-3">
          <div class="input-group input-group-sm">
            <input class="form-control form-control-navbar" type="search" placeholder="查找" aria-label="Search">
            <div class="input-group-append">
              <button class="btn btn-navbar" type="submit">
                <i class="fa fa-search"></i>
              </button>
            </div>
          </div>
        </form>
      </div>

      <!-- Right navbar links -->
      <ul class="order-1 order-md-3 navbar-nav navbar-no-expand ml-auto">
        <!-- 角色下拉信息 -->
        <li class="nav-item dropdown">
          <a class="nav-link" data-toggle="dropdown" href="#">
            <i class="fa fa-user-o"></i>
            <span class="badge badge-danger navbar-badge">3</span>
          </a>
          <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
            <a href="#" class="dropdown-item">
              <!-- Message Start -->
              <div class="media">
                <img src="dist/img/avatar5.png" alt="User Avatar" class="img-size-50 mr-3 img-circle">
                <div class="media-body">
                  <h3 class="dropdown-item-title">
                    张三
                    <span class="float-right text-sm text-danger"><i class="fa fa-star"></i></span>
                  </h3>
                  <p class="text-sm">把昨天的记录发给我</p>
                  <p class="text-sm text-muted"><i class="far fa-clock mr-1"></i> 4 小时 前</p>
                </div>
              </div>
              <!-- Message End -->
            </a>
            <div class="dropdown-divider"></div>
            <a href="#" class="dropdown-item dropdown-footer">查看所有消息</a>
          </div>
        </li>
<!--          消息下拉列表-->
        <li class="nav-item dropdown show">
          <a class="nav-link" data-toggle="dropdown" href="#" aria-expanded="true">
            <i class="fa fa-bell-o"></i>
            <span class="badge badge-warning navbar-badge">15</span>
          </a>
          <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right" style="left: inherit; right: 0px;">
            <span class="dropdown-item dropdown-header">15 条消息</span>
            <div class="dropdown-divider"></div>
            <a href="#" class="dropdown-item">
              <i class="fa fa-envelope mr-2"></i> 4 条新消息
              <span class="float-right text-muted text-sm">3 mins</span>
            </a>
            <div class="dropdown-divider"></div>
            <a href="#" class="dropdown-item">
              <i class="fa fa-users mr-2"></i> 8 条好友回复
              <span class="float-right text-muted text-sm">12 hours</span>
            </a>
            <div class="dropdown-divider"></div>
            <a href="#" class="dropdown-item">
              <i class="fa fa-file mr-2"></i> 3 份新报告
              <span class="float-right text-muted text-sm">2 days</span>
            </a>
            <div class="dropdown-divider"></div>
            <a href="#" class="dropdown-item dropdown-footer">查看所有通知</a>
          </div>
        </li>

<!--        <li class="nav-item">-->
<!--          <a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#" role="button">-->
<!--            <i class="fas fa-th-large"></i>-->
<!--          </a>-->
<!--        </li>-->
      </ul>
    </div>
  </nav>
  <!-- /.navbar -->

  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper pt-3">
    <!-- Content Header (Page header) -->

    <!-- /.content-header -->
    <!-- Main content -->
    <div class="content">
      <!--通知消息-->
     <div class="container">
<!--轮播图-->
       <div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
         <ol class="carousel-indicators">
           <li data-target="#carouselExampleCaptions" data-slide-to="0" class="active"></li>
           <li data-target="#carouselExampleCaptions" data-slide-to="1"></li>
           <li data-target="#carouselExampleCaptions" data-slide-to="2"></li>
         </ol>
         <div class="carousel-inner">
           <div class="carousel-item active">
             <img src="dist/img/01.jpg" class="d-block w-100" alt="...">
             <div class="carousel-caption d-none d-md-block">
<!--               <h5>First slide label</h5>-->
<!--               <p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>-->
             </div>
           </div>
           <div class="carousel-item">
             <img src="dist/img/02.jpg" class="d-block w-100" alt="...">
             <div class="carousel-caption d-none d-md-block">
<!--               <h5>Second slide label</h5>-->
<!--               <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>-->
             </div>
           </div>
           <div class="carousel-item">
             <img src="dist/img/03.jpg" class="d-block w-100" alt="...">
             <div class="carousel-caption d-none d-md-block">
<!--               <h5>Third slide label</h5>-->
<!--               <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p>-->
             </div>
           </div>
         </div>
         <a class="carousel-control-prev" href="#carouselExampleCaptions" role="button" data-slide="prev">
           <span class="carousel-control-prev-icon" aria-hidden="true"></span>
           <span class="sr-only">Previous</span>
         </a>
         <a class="carousel-control-next" href="#carouselExampleCaptions" role="button" data-slide="next">
           <span class="carousel-control-next-icon" aria-hidden="true"></span>
           <span class="sr-only">Next</span>
         </a>
       </div>
<!--       面包屑导航-->
<!--       <div class="content-header">-->
<!--           <div class="row">-->
<!--             <ol class="breadcrumb float-sm-left">-->
<!--               <li class="breadcrumb-item"><a href="#">首页</a></li>-->
<!--               <li class="breadcrumb-item active">业务中心</li>-->
<!--             </ol>-->
<!--           </div>-->
<!--       </div>-->

<!--       <h6 class="border-bottom ">通知消息</h6>-->
      <!-- 通知消息列表-->
        <div class="row mt-3">
          <div class="col-lg-6">
            <div class="card card-lightblue card-outline">
              <div class="card-header">
                <h5 class="card-title m-0">通知公告</h5>
              </div>
              <div class="card-body">
                <div class="d-flex justify-content-between mb-2">
                  <a href="#" class="text-dark d-block">1. 2020年第二期助学贷款工作启动</a>
                  <span class="text-black-50">2020-9-10</span>
                </div>

                <div class="d-flex justify-content-between mb-2">
                  <a href="#" class="text-dark d-block">1. 2020年第二期助学贷款工作启动</a>
                  <span class="text-black-50">2020-9-10</span>
                </div>

                <div class="d-flex justify-content-between mb-2">
                  <a href="#" class="text-dark d-block">1. 2020年第二期助学贷款工作启动</a>
                  <span class="text-black-50">2020-9-10</span>
                </div>
              </div>
            </div><!-- /.card -->
          </div>
          <!-- /.col-md-6 -->
          <div class="col-lg-6" >
            <div class="card card-lightblue card-outline">
              <div class="card-header">
                <h5 class="card-title m-0">新闻资讯</h5>
              </div>
              <div class="card-body">
                <div class="d-flex justify-content-between mb-2">
                  <a href="#" class="text-dark d-block">1. 新闻</a>
                  <span class="text-black-50">2020-9-10</span>
                </div>
                <div class="d-flex justify-content-between mb-2">
                  <a href="#" class="text-dark d-block">2. 资讯</a>
                  <span class="text-black-50">2020-9-10</span>
                </div>

                <div class="d-flex justify-content-between mb-2">
                  <a href="#" class="text-dark d-block">3. 新闻</a>
                  <span class="text-black-50">2020-9-10</span>
                </div>
              </div>
            </div><!-- /.card -->
          </div>
          <!-- /.col-md-6 -->
        </div>
        <!-- /.row -->

       <!--      应用程序列表-->
       <!--       <h6 class="border-bottom">业务中心</h6>-->
       <div class="card card-lightblue card-outline">
         <div class="card-header">
           <h3 class="card-title">应用程序</h3>
         </div>
         <div class="card-body">
           <a class="btn btn-app bg-primary">
             <i class="fa fa-building"></i> App
           </a>
           <a class="btn btn-app bg-pink">
             <i class="fa fa-id-card"></i> App
           </a>
           <a class="btn btn-app bg-warning">
             <i class="fa fa-user"></i> 暂停
           </a>
           <a class="btn btn-app bg-info">
             <i class="fa fa-book"></i> 保存
           </a>
           <a class="btn btn-app bg-danger">
             <span class="badge bg-warning">3</span>
             <i class="fa fa-bullhorn"></i> 通知
           </a>
           <a class="btn btn-app bg-fuchsia">
             <span class="badge bg-success">300</span>
             <i class="fa fa-barcode"></i> 产品
           </a>
           <a class="btn btn-app bg-cyan">
             <span class="badge bg-purple">891</span>
             <i class="fa fa-users"></i> 用户
           </a>
           <a class="btn btn-app bg-gradient-blue">
             <span class="badge bg-teal">67</span>
             <i class="fa fa-inbox"></i> 订单
           </a>
           <a class="btn btn-app bg-gradient-green">
             <span class="badge bg-info">12</span>
             <i class="fa fa-envelope"></i> 收件箱
           </a>
           <a class="btn btn-app bg-gradient-info">
             <span class="badge bg-danger">531</span>
             <i class="fa fa-heart"></i> 喜欢
           </a>
           <a class="btn btn-app bg-gradient-purple">
             <span class="badge bg-purple">891</span>
             <i class="fa fa-users"></i> 用户
           </a>
         </div>
         <!-- /.card-body -->
       </div>

<!--       周月报告图表-->
       <div class="row">
         <div class="col-md-12">
           <div class="card card-lightblue card-outline">
             <div class="card-header">
               <h5 class="card-title">月报告</h5>

               <div class="card-tools">
                 <button type="button" class="btn btn-tool" data-card-widget="collapse">
                   <i class="fa fa-minus"></i>
                 </button>
                 <div class="btn-group">
                   <button type="button" class="btn btn-tool dropdown-toggle" data-toggle="dropdown">
                     <i class="fa fa-wrench"></i>
                   </button>
                   <div class="dropdown-menu dropdown-menu-right" role="menu">
                     <a href="#" class="dropdown-item">操作</a>
                     <a href="#" class="dropdown-item">另一个操作</a>
                     <a href="#" class="dropdown-item">其他</a>
                     <a class="dropdown-divider"></a>
                     <a href="#" class="dropdown-item">分隔符</a>
                   </div>
                 </div>
                 <button type="button" class="btn btn-tool" data-card-widget="remove">
                   <i class="fa fa-times"></i>
                 </button>
               </div>
             </div>
             <!-- /.card-header -->
             <div class="card-body">
               <div class="row">
                 <div class="col-md-8">
                   <p class="text-center">
                     <strong>工单量: 2014年1月1日 - 2014年7月30日</strong>
                   </p>

                   <div class="chart"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>
                     <!-- Sales Chart Canvas -->
                     <canvas id="salesChart" height="180" style="height: 180px; display: block; width: 622px;" width="622" class="chartjs-render-monitor"></canvas>
                   </div>
                   <!-- /.chart-responsive -->
                 </div>
                 <!-- /.col -->
                 <div class="col-md-4">
                   <p class="text-center">
                     <strong>完成目标</strong>
                   </p>

                   <div class="progress-group">
                     派单量
                     <span class="float-right"><b>160</b>/200</span>
                     <div class="progress progress-sm">
                       <div class="progress-bar bg-primary" style="width: 80%"></div>
                     </div>
                   </div>
                   <!-- /.progress-group -->

                   <div class="progress-group">
                     完成工单量
                     <span class="float-right"><b>310</b>/400</span>
                     <div class="progress progress-sm">
                       <div class="progress-bar bg-danger" style="width: 75%"></div>
                     </div>
                   </div>

                   <!-- /.progress-group -->
                   <div class="progress-group">
                     <span class="progress-text">访问量</span>
                     <span class="float-right"><b>480</b>/800</span>
                     <div class="progress progress-sm">
                       <div class="progress-bar bg-success" style="width: 60%"></div>
                     </div>
                   </div>

                   <!-- /.progress-group -->
                   <div class="progress-group">
                     收到申诉量
                     <span class="float-right"><b>250</b>/500</span>
                     <div class="progress progress-sm">
                       <div class="progress-bar bg-warning" style="width: 50%"></div>
                     </div>
                   </div>
                   <!-- /.progress-group -->
                 </div>
                 <!-- /.col -->
               </div>
               <!-- /.row -->
             </div>
             <!-- ./card-body -->
             <div class="card-footer">
               <div class="row">
                 <div class="col-sm-3 col-6">
                   <div class="description-block border-right">
                     <span class="description-percentage text-success"><i class="fa fa-caret-up"></i> 17%</span>
                     <h5 class="description-header">￥35,210.43</h5>
                     <span class="description-text">总收入</span>
                   </div>
                   <!-- /.description-block -->
                 </div>
                 <!-- /.col -->
                 <div class="col-sm-3 col-6">
                   <div class="description-block border-right">
                     <span class="description-percentage text-warning"><i class="fa fa-caret-left"></i> 0%</span>
                     <h5 class="description-header">￥10,390.90</h5>
                     <span class="description-text">总支出</span>
                   </div>
                   <!-- /.description-block -->
                 </div>
                 <!-- /.col -->
                 <div class="col-sm-3 col-6">
                   <div class="description-block border-right">
                     <span class="description-percentage text-success"><i class="fa fa-caret-up"></i> 20%</span>
                     <h5 class="description-header">￥24,813.53</h5>
                     <span class="description-text">利润总额</span>
                   </div>
                   <!-- /.description-block -->
                 </div>
                 <!-- /.col -->
                 <div class="col-sm-3 col-6">
                   <div class="description-block">
                     <span class="description-percentage text-danger"><i class="fa fa-caret-down"></i> 18%</span>
                     <h5 class="description-header">1200</h5>
                     <span class="description-text">完成目标</span>
                   </div>
                   <!-- /.description-block -->
                 </div>
               </div>
               <!-- /.row -->
             </div>
             <!-- /.card-footer -->
           </div>
           <!-- /.card -->
         </div>
         <!-- /.col -->
       </div>
<!--      第一种信息列表-->
       <div class="row">
         <div class="col-md-3 col-sm-6 col-12">
           <div class="info-box bg-gradient-primary">
             <span class="info-box-icon"><i class="fa fa-hand-paper-o"></i></span>

             <div class="info-box-content">
               <span class="info-box-text">投诉</span>
               <span class="info-box-number">41,410</span>

               <div class="progress">
                 <div class="progress-bar" style="width: 70%"></div>
               </div>
               <span class="progress-description">
                  30 天增加 70%
                </span>
             </div>
             <!-- /.info-box-content -->
           </div>
           <!-- /.info-box -->
         </div>
         <!-- /.col -->
         <div class="col-md-3 col-sm-6 col-12">
           <div class="info-box bg-gradient-success">
             <span class="info-box-icon"><i class="fa fa-thumbs-up"></i></span>

             <div class="info-box-content">
               <span class="info-box-text">点赞</span>
               <span class="info-box-number">41,410</span>

               <div class="progress">
                 <div class="progress-bar" style="width: 70%"></div>
               </div>
               <span class="progress-description">
                  30 天增加 70%
                </span>
             </div>
             <!-- /.info-box-content -->
           </div>
           <!-- /.info-box -->
         </div>
         <!-- /.col -->
         <div class="col-md-3 col-sm-6 col-12">
           <div class="info-box bg-gradient-warning">
             <span class="info-box-icon"><i class="fa fa-handshake-o"></i></span>

             <div class="info-box-content">
               <span class="info-box-text">中评</span>
               <span class="info-box-number">41,410</span>

               <div class="progress">
                 <div class="progress-bar" style="width: 70%"></div>
               </div>
               <span class="progress-description">
                  30 天增加 70%
                </span>
             </div>
             <!-- /.info-box-content -->
           </div>
           <!-- /.info-box -->
         </div>
         <!-- /.col -->
         <div class="col-md-3 col-sm-6 col-12">
           <div class="info-box bg-gradient-danger">
             <span class="info-box-icon"><i class="fa fa-thumbs-down"></i></span>

             <div class="info-box-content">
               <span class="info-box-text">差评</span>
               <span class="info-box-number">41,410</span>

               <div class="progress">
                 <div class="progress-bar" style="width: 70%"></div>
               </div>
               <span class="progress-description">
                  30 天增加 70%
                </span>
             </div>
             <!-- /.info-box-content -->
           </div>
           <!-- /.info-box -->
         </div>
         <!-- /.col -->
       </div>
<!--第二种信息列表-->
       <section>
         <!--       <div class="row">-->
         <!--         <div class="col-12 col-sm-6 col-md-3">-->
         <!--           <div class="info-box">-->
         <!--             <span class="info-box-icon bg-info elevation-1"><i class="fa fa-cog"></i></span>-->

         <!--             <div class="info-box-content">-->
         <!--               <span class="info-box-text">CPU 负载</span>-->
         <!--               <span class="info-box-number">-->
         <!--                  10-->
         <!--                  <small>%</small>-->
         <!--                </span>-->
         <!--             </div>-->
         <!--             &lt;!&ndash; /.info-box-content &ndash;&gt;-->
         <!--           </div>-->
         <!--           &lt;!&ndash; /.info-box &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-12 col-sm-6 col-md-3">-->
         <!--           <div class="info-box mb-3">-->
         <!--             <span class="info-box-icon bg-danger elevation-1"><i class="fa fa-thumbs-up"></i></span>-->

         <!--             <div class="info-box-content">-->
         <!--               <span class="info-box-text">喜欢</span>-->
         <!--               <span class="info-box-number">41,410</span>-->
         <!--             </div>-->
         <!--             &lt;!&ndash; /.info-box-content &ndash;&gt;-->
         <!--           </div>-->
         <!--           &lt;!&ndash; /.info-box &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->

         <!--         &lt;!&ndash; fix for small devices only &ndash;&gt;-->
         <!--         <div class="clearfix hidden-md-up"></div>-->

         <!--         <div class="col-12 col-sm-6 col-md-3">-->
         <!--           <div class="info-box mb-3">-->
         <!--             <span class="info-box-icon bg-success elevation-1"><i class="fa fa-shopping-cart"></i></span>-->

         <!--             <div class="info-box-content">-->
         <!--               <span class="info-box-text">销量</span>-->
         <!--               <span class="info-box-number">760</span>-->
         <!--             </div>-->
         <!--             &lt;!&ndash; /.info-box-content &ndash;&gt;-->
         <!--           </div>-->
         <!--           &lt;!&ndash; /.info-box &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-12 col-sm-6 col-md-3">-->
         <!--           <div class="info-box mb-3">-->
         <!--             <span class="info-box-icon bg-warning elevation-1"><i class="fa fa-users"></i></span>-->

         <!--             <div class="info-box-content">-->
         <!--               <span class="info-box-text">新成员</span>-->
         <!--               <span class="info-box-number">2,000</span>-->
         <!--             </div>-->
         <!--             &lt;!&ndash; /.info-box-content &ndash;&gt;-->
         <!--           </div>-->
         <!--           &lt;!&ndash; /.info-box &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--       </div>-->

       </section>
<!--       功能卡片列表-->
       <section>
         <!--       功能列表第一行-->
         <!--       <div class="row">-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-primary">-->
         <!--                 <p class="card-title">宿舍管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-building fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 宿舍信息录入、排宿、调/退宿、留宿、卫生管理-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-green">-->
         <!--                 <p class="card-title">学生信息管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-id-card-o fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 学生信息核实、档案管理、异动，日常行为管理-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-warning">-->
         <!--                 <p class="card-title">班级管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-user-o fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 班级信息增加、修改，班干部信息管理-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-danger">-->
         <!--                 <p class="card-title">教工管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-group fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 班级信息增加、修改，班干部信息管理-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--       </div>-->
         <!--      .row-->
         <!--  功能列表第二行-->
         <!--       <div class="row">-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-primary">-->
         <!--                 <p class="card-title">社团管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-group fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 社团信息增加、修改、删除，成员管理、事务管理-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-green">-->
         <!--                 <p class="card-title">奖助贷管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-money fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 奖学金、助学金、贫困生、勤工俭学、学费减免...-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-warning">-->
         <!--                 <p class="card-title">毕业生管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-hand-paper-o fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 毕业生档案管理、就业跟踪管理......-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-danger">-->
         <!--                 <p class="card-title">评奖管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-handshake-o fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 信息配置、在线填报管理、智能推荐、评奖评优...-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--       </div>&lt;!&ndash;       row&ndash;&gt;-->
         <!--       功能列表第三行-->
         <!--       <div class="row">-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-primary">-->
         <!--                 <p class="card-title">数据交换管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-database fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 数据共享、数据抽取、数据清洗、配置管理-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-green">-->
         <!--                 <p class="card-title">基础信息管理</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-pencil-square-o fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 奖学金、助学金、贫困生、勤工俭学、学费减免...-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-warning">-->
         <!--                 <p class="card-title">综合服务</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-gears fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 学生工作信息申请、请假、填报，信息公示、通知...-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--         <div class="col-md-3">-->
         <!--           <a href="#">-->
         <!--             <div class="card">-->
         <!--               <div class="card-header bg-gradient-danger">-->
         <!--                 <p class="card-title">报表中心服务</p>-->
         <!--                 <div class="card-tools">-->
         <!--                   <i class="fa fa-file-text-o fa-2x mr-2"></i>-->

         <!--                 </div>-->
         <!--                 &lt;!&ndash; /.card-tools &ndash;&gt;-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-header &ndash;&gt;-->
         <!--               <div class="card-body">-->
         <!--                 学工系统、报表模板、打印等 ... ...-->
         <!--               </div>-->
         <!--               &lt;!&ndash; /.card-body &ndash;&gt;-->
         <!--             </div>-->
         <!--           </a>-->

         <!--           &lt;!&ndash; /.card &ndash;&gt;-->
         <!--         </div>-->
         <!--         &lt;!&ndash; /.col &ndash;&gt;-->
         <!--       </div>&lt;!&ndash;       row&ndash;&gt;-->
       </section>
<!--       订单列表-->
<div class="row">
  <div class="col-8">
    <div class="card card-lightblue card-outline">
      <div class="card-header border-transparent">
        <h3 class="card-title">报修列表</h3>

        <div class="card-tools">
          <button type="button" class="btn btn-tool" data-card-widget="collapse">
            <i class="fa fa-minus"></i>
          </button>
          <button type="button" class="btn btn-tool" data-card-widget="remove">
            <i class="fa fa-times"></i>
          </button>
        </div>
      </div>
      <!-- /.card-header -->
      <div class="card-body p-0">
        <div class="table-responsive">
          <table class="table m-0">
            <thead>
            <tr>
              <th>工单编号</th>
              <th>类别</th>
              <th>状态</th>
              <th>备注</th>
            </tr>
            </thead>
            <tbody>
            <tr>
              <td><a href="#">OR9842</a></td>
              <td>灯具修理</td>
              <td><span class="badge badge-success">已派单</span></td>
              <td>
                <div class="sparkbar" data-color="#00a65a" data-height="20">90,80,90,-70,61,-83,63</div>
              </td>
            </tr>
            <tr>
              <td><a href="#">OR1848</a></td>
              <td>门锁更换</td>
              <td><span class="badge badge-warning">待处理</span></td>
              <td>
                <div class="sparkbar" data-color="#f39c12" data-height="20">90,80,-90,70,61,-83,68</div>
              </td>
            </tr>
            <tr>
              <td><a href="#">OR7429</a></td>
              <td>灯具修理</td>
              <td><span class="badge badge-danger">已交付</span></td>
              <td>
                <div class="sparkbar" data-color="#f56954" data-height="20">90,-80,90,70,-61,83,63</div>
              </td>
            </tr>
            <tr>
              <td><a href="#">OR7429</a></td>
              <td>床铺修理</td>
              <td><span class="badge badge-info">处理中</span></td>
              <td>
                <div class="sparkbar" data-color="#00c0ef" data-height="20">90,80,-90,70,-61,83,63</div>
              </td>
            </tr>
            <tr>
              <td><a href="#">OR1848</a></td>
              <td>空调修理</td>
              <td><span class="badge badge-warning">待处理</span></td>
              <td>
                <div class="sparkbar" data-color="#f39c12" data-height="20">90,80,-90,70,61,-83,68</div>
              </td>
            </tr>
            <tr>
              <td><a href="#">OR7429</a></td>
              <td>电视修理</td>
              <td><span class="badge badge-danger">已交付</span></td>
              <td>
                <div class="sparkbar" data-color="#f56954" data-height="20">90,-80,90,70,-61,83,63</div>
              </td>
            </tr>
            <tr>
              <td><a href="#">OR9842</a></td>
              <td>门锁修理</td>
              <td><span class="badge badge-success">已发货</span></td>
              <td>
                <div class="sparkbar" data-color="#00a65a" data-height="20">90,80,90,-70,61,-83,63</div>
              </td>
            </tr>
            </tbody>
          </table>
        </div>
        <!-- /.table-responsive -->
      </div>
      <!-- /.card-body -->
      <div class="card-footer clearfix">
        <a href="javascript:void(0)" class="btn btn-sm btn-info float-left">下单</a>
        <a href="javascript:void(0)" class="btn btn-sm btn-secondary float-right">查看所有工单</a>
      </div>
      <!-- /.card-footer -->
    </div>
  </div>
  <div class="col-4">
    <div class="card card-lightblue card-outline" >
      <div class="card-header">
        <h3 class="card-title">最近添加的产品</h3>

        <div class="card-tools">
          <button type="button" class="btn btn-tool" data-card-widget="collapse">
            <i class="fa fa-minus"></i>
          </button>
          <button type="button" class="btn btn-tool" data-card-widget="remove">
            <i class="fa fa-times"></i>
          </button>
        </div>
      </div>
      <!-- /.card-header -->
      <div class="card-body p-0">
        <ul class="products-list product-list-in-card pl-2 pr-2">
          <li class="item">
            <div class="product-img">
              <img src="dist/img/default-150x150.png" alt="产品图片" class="img-size-50">
            </div>
            <div class="product-info">
              <a href="javascript:void(0)" class="product-title">电视
                <span class="badge badge-warning float-right">￥1800</span></a>
              <span class="product-description">
                        海信
                      </span>
            </div>
          </li>
          <!-- /.item -->
          <li class="item">
            <div class="product-img">
              <img src="dist/img/default-150x150.png" alt="产品图片" class="img-size-50">
            </div>
            <div class="product-info">
              <a href="javascript:void(0)" class="product-title">冰箱
                <span class="badge badge-info float-right">￥700</span></a>
              <span class="product-description">
                       海尔
                      </span>
            </div>
          </li>
          <!-- /.item -->
          <li class="item">
            <div class="product-img">
              <img src="dist/img/default-150x150.png" alt="产品图片" class="img-size-50">
            </div>
            <div class="product-info">
              <a href="javascript:void(0)" class="product-title">
                电灯 <span class="badge badge-danger float-right">
                        ￥350
                      </span>
              </a>
              <span class="product-description">
                       欧普
                      </span>
            </div>
          </li>
          <!-- /.item -->
          <li class="item">
            <div class="product-img">
              <img src="dist/img/default-150x150.png" alt="产品图片" class="img-size-50">
            </div>
            <div class="product-info">
              <a href="javascript:void(0)" class="product-title">空调
                <span class="badge badge-success float-right">￥399</span></a>
              <span class="product-description">
                        美的
                      </span>
            </div>
          </li>
          <!-- /.item -->
          <li class="item">
            <div class="product-img">
              <img src="dist/img/default-150x150.png" alt="产品图片" class="img-size-50">
            </div>
            <div class="product-info">
              <a href="javascript:void(0)" class="product-title">汽车
                <span class="badge badge-success float-right">￥399</span></a>
              <span class="product-description">
                       吉利
                      </span>
            </div>
          </li>
          <!-- /.item -->
        </ul>
      </div>
      <!-- /.card-body -->
      <div class="card-footer text-center">
        <a href="javascript:void(0)" class="uppercase">查看所有产品</a>
      </div>
      <!-- /.card-footer -->
    </div>
  </div>
</div>
<!--FLOT图表-->
         <div class="row">
           <div class="col-12">
             <!-- interactive chart -->
             <div class="card card-primary card-outline">
               <div class="card-header">
                 <h3 class="card-title">
                   <i class="fa fa-chart-bar"></i>
                   动态监视
                 </h3>

                 <div class="card-tools">
                   实时
                   <div class="btn-group" id="realtime" data-toggle="btn-toggle">
                     <button type="button" class="btn btn-default btn-sm active" data-toggle="on">开</button>
                     <button type="button" class="btn btn-default btn-sm" data-toggle="off">关</button>
                   </div>
                 </div>
               </div>
               <div class="card-body">
                 <div id="interactive" style="height: 300px; padding: 0px; position: relative;"><canvas class="flot-base" width="942" height="300" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 942px; height: 300px;"></canvas><canvas class="flot-overlay" width="942" height="300" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 942px; height: 300px;"></canvas><div class="flot-svg" style="position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; pointer-events: none;"><svg style="width: 100%; height: 100%;"><g class="flot-x-axis flot-x1-axis xAxis x1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px;"><text x="28" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">0</text><text x="115.13454861111111" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">10</text><text x="206.24565972222223" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">20</text><text x="297.3567708333333" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">30</text><text x="388.46788194444446" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">40</text><text x="479.57899305555554" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">50</text><text x="570.6901041666666" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">60</text><text x="661.8012152777777" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">70</text><text x="752.9123263888889" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">80</text><text x="844.0234375" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">90</text></g><g class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px;"><text x="8.953125" y="269" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">0</text><text x="1" y="218.2" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">20</text><text x="1" y="167.4" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">40</text><text x="1" y="116.6" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">60</text><text x="1" y="65.8" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">80</text><text x="-6.953125" y="15" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">100</text></g></svg></div></div>
               </div>
               <!-- /.card-body-->
             </div>
             <!-- /.card -->

           </div>
           <!-- /.col -->
         </div>
         <!-- /.row -->

         <div class="row">
           <div class="col-md-6">
             <!-- Line chart -->
             <div class="card card-primary card-outline">
               <div class="card-header">
                 <h3 class="card-title">
                   <i class="fa fa-chart-bar"></i>
                   趋势图
                 </h3>

                 <div class="card-tools">
                   <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-minus"></i>
                   </button>
                   <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fa fa-times"></i>
                   </button>
                 </div>
               </div>
               <div class="card-body">
                 <div id="line-chart" style="height: 300px; padding: 0px; position: relative;"><canvas class="flot-base" width="443" height="300" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 443.5px; height: 300px;"></canvas><canvas class="flot-overlay" width="443" height="300" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 443.5px; height: 300px;"></canvas><div class="flot-svg" style="position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; pointer-events: none;"><svg style="width: 100%; height: 100%;"><g class="flot-x-axis flot-x1-axis xAxis x1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px;"><text x="37" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">0</text><text x="95.44444444444444" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">2</text><text x="153.88888888888889" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">4</text><text x="212.33333333333331" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">6</text><text x="270.77777777777777" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">8</text><text x="325.24565972222223" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">10</text><text x="383.69010416666663" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">12</text></g><g class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px;"><text x="1" y="269" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">-1.5</text><text x="1" y="226.66666666666669" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">-1.0</text><text x="1" y="184.33333333333334" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">-0.5</text><text x="5.984375" y="15" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">1.5</text><text x="5.984375" y="142" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">0.0</text><text x="5.984375" y="99.66666666666667" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">0.5</text><text x="5.984375" y="57.333333333333336" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">1.0</text></g></svg></div></div>
               </div>
               <!-- /.card-body-->
             </div>
             <!-- /.card -->

             <!-- Area chart -->
             <div class="card card-primary card-outline">
               <div class="card-header">
                 <h3 class="card-title">
                   <i class="fa fa-chart-bar"></i>
                   区域图
                 </h3>

                 <div class="card-tools">
                   <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-minus"></i>
                   </button>
                   <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fa fa-times"></i>
                   </button>
                 </div>
               </div>
               <div class="card-body">
                 <div id="area-chart" style="height: 338px; padding: 0px; position: relative;" class="full-width-chart"><canvas class="flot-base" width="481" height="338" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 481.5px; height: 338px;"></canvas><canvas class="flot-overlay" width="481" height="338" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 481.5px; height: 338px;"></canvas></div>
               </div>
               <!-- /.card-body-->
             </div>
             <!-- /.card -->

           </div>
           <!-- /.col -->

           <div class="col-md-6">
             <!-- Bar chart -->
             <div class="card card-primary card-outline">
               <div class="card-header">
                 <h3 class="card-title">
                   <i class="fa fa-chart-bar"></i>
                   条形图
                 </h3>

                 <div class="card-tools">
                   <button type="button" class="btn btn-tool" data-card-widget="collapse">
                     <i class="fa fa-minus"></i>
                   </button>
                   <button type="button" class="btn btn-tool" data-card-widget="remove">
                     <i class="fa fa-times"></i>
                   </button>
                 </div>
               </div>
               <div class="card-body">
                 <div id="bar-chart" style="height: 300px; padding: 0px; position: relative;"><canvas class="flot-base" width="443" height="300" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 443.5px; height: 300px;"></canvas><canvas class="flot-overlay" width="443" height="300" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 443.5px; height: 300px;"></canvas><div class="flot-svg" style="position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; pointer-events: none;"><svg style="width: 100%; height: 100%;"><g class="flot-x-axis flot-x1-axis xAxis x1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px;"><text x="105.65909090909092" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">二月</text><text x="177.38636363636365" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">三月</text><text x="249.11363636363637" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">四月</text><text x="320.3409090909091" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">五月</text><text x="33.43181818181819" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">一月</text><text x="392.56818181818187" y="294" class="flot-tick-label tickLabel" style="position: absolute; text-align: center;">六月</text></g><g class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px;"><text x="8.953125" y="269" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">0</text><text x="8.953125" y="205.5" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">5</text><text x="1" y="15" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">20</text><text x="1" y="142" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">10</text><text x="1" y="78.5" class="flot-tick-label tickLabel" style="position: absolute; text-align: right;">15</text></g></svg></div></div>
               </div>
               <!-- /.card-body-->
             </div>
             <!-- /.card -->

             <!-- Donut chart -->
             <div class="card card-primary card-outline">
               <div class="card-header">
                 <h3 class="card-title">
                   <i class="fa fa-chart-bar"></i>
                   环形图
                 </h3>

                 <div class="card-tools">
                   <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-minus"></i>
                   </button>
                   <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fa fa-times"></i>
                   </button>
                 </div>
               </div>
               <div class="card-body">
                 <div id="donut-chart" style="height: 300px; padding: 0px; position: relative;"><canvas class="flot-base" width="443" height="300" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 443.5px; height: 300px;"></canvas><canvas class="flot-overlay" width="443" height="300" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 443.5px; height: 300px;"></canvas><span class="pieLabel" id="pieLabel0" style="position: absolute; top: 70px; left: 284.312px;"><div style="font-size:13px; text-align:center; padding:2px; color: #fff; font-weight: 600;">系列2<br>30%</div></span><span class="pieLabel" id="pieLabel1" style="position: absolute; top: 210px; left: 262.312px;"><div style="font-size:13px; text-align:center; padding:2px; color: #fff; font-weight: 600;">系列3<br>20%</div></span><span class="pieLabel" id="pieLabel2" style="position: absolute; top: 129px; left: 103.312px;"><div style="font-size:13px; text-align:center; padding:2px; color: #fff; font-weight: 600;">系列4<br>50%</div></span></div>
               </div>
               <!-- /.card-body-->
             </div>
             <!-- /.card -->
           </div>
           <!-- /.col -->
         </div>
         <!-- /.row -->

<!--echarts图-->
       <section>
<!--       <div class="row">-->
<!--         <div class="col-md-6">-->
<!--           &lt;!&ndash; 区域图 &ndash;&gt;-->
<!--           <div class="card card-primary">-->
<!--             <div class="card-header">-->
<!--               <h3 class="card-title">区域图</h3>-->

<!--               <div class="card-tools">-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-minus"></i>-->
<!--                 </button>-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fa fa-times"></i></button>-->
<!--               </div>-->
<!--             </div>-->
<!--             <div class="card-body">-->
<!--               <div class="chart"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>-->
<!--                 <canvas id="areaChart" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%; display: block; width: 444px;" width="444" height="250" class="chartjs-render-monitor"></canvas>-->
<!--               </div>-->
<!--             </div>-->
<!--             &lt;!&ndash; /.card-body &ndash;&gt;-->
<!--           </div>-->
<!--           &lt;!&ndash; /.card &ndash;&gt;-->

<!--           &lt;!&ndash; 环形图 &ndash;&gt;-->
<!--           <div class="card card-danger">-->
<!--             <div class="card-header">-->
<!--               <h3 class="card-title">环形图</h3>-->

<!--               <div class="card-tools">-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-minus"></i>-->
<!--                 </button>-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fa fa-times"></i></button>-->
<!--               </div>-->
<!--             </div>-->
<!--             <div class="card-body"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>-->
<!--               <canvas id="donutChart" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%; display: block; width: 444px;" width="444" height="250" class="chartjs-render-monitor"></canvas>-->
<!--             </div>-->
<!--             &lt;!&ndash; /.card-body &ndash;&gt;-->
<!--           </div>-->
<!--           &lt;!&ndash; /.card &ndash;&gt;-->

<!--           &lt;!&ndash; 饼形图 &ndash;&gt;-->
<!--           <div class="card card-danger">-->
<!--             <div class="card-header">-->
<!--               <h3 class="card-title">饼形图</h3>-->

<!--               <div class="card-tools">-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-minus"></i>-->
<!--                 </button>-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fa fa-times"></i></button>-->
<!--               </div>-->
<!--             </div>-->
<!--             <div class="card-body"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>-->
<!--               <canvas id="pieChart" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%; display: block; width: 444px;" width="444" height="250" class="chartjs-render-monitor"></canvas>-->
<!--             </div>-->
<!--             &lt;!&ndash; /.card-body &ndash;&gt;-->
<!--           </div>-->
<!--           &lt;!&ndash; /.card &ndash;&gt;-->

<!--         </div>-->
<!--         &lt;!&ndash; /.col (LEFT) &ndash;&gt;-->
<!--         <div class="col-md-6">-->
<!--           &lt;!&ndash; 折线图 &ndash;&gt;-->
<!--           <div class="card card-info">-->
<!--             <div class="card-header">-->
<!--               <h3 class="card-title">折线图</h3>-->

<!--               <div class="card-tools">-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-minus"></i>-->
<!--                 </button>-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fa fa-times"></i></button>-->
<!--               </div>-->
<!--             </div>-->
<!--             <div class="card-body">-->
<!--               <div class="chart"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>-->
<!--                 <canvas id="lineChart" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%; display: block; width: 444px;" width="444" height="250" class="chartjs-render-monitor"></canvas>-->
<!--               </div>-->
<!--             </div>-->
<!--             &lt;!&ndash; /.card-body &ndash;&gt;-->
<!--           </div>-->
<!--           &lt;!&ndash; /.card &ndash;&gt;-->

<!--           &lt;!&ndash; 条形图 &ndash;&gt;-->
<!--           <div class="card card-success">-->
<!--             <div class="card-header">-->
<!--               <h3 class="card-title">条形图</h3>-->

<!--               <div class="card-tools">-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-minus"></i>-->
<!--                 </button>-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fa fa-times"></i></button>-->
<!--               </div>-->
<!--             </div>-->
<!--             <div class="card-body">-->
<!--               <div class="chart"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>-->
<!--                 <canvas id="barChart" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%; display: block; width: 444px;" width="444" height="250" class="chartjs-render-monitor"></canvas>-->
<!--               </div>-->
<!--             </div>-->
<!--             &lt;!&ndash; /.card-body &ndash;&gt;-->
<!--           </div>-->
<!--           &lt;!&ndash; /.card &ndash;&gt;-->

<!--           &lt;!&ndash; 堆叠图 &ndash;&gt;-->
<!--           <div class="card card-success">-->
<!--             <div class="card-header">-->
<!--               <h3 class="card-title">堆叠图</h3>-->

<!--               <div class="card-tools">-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-minus"></i>-->
<!--                 </button>-->
<!--                 <button type="button" class="btn btn-tool" data-card-widget="remove"><i class="fa fa-times"></i></button>-->
<!--               </div>-->
<!--             </div>-->
<!--             <div class="card-body">-->
<!--               <div class="chart"><div class="chartjs-size-monitor"><div class="chartjs-size-monitor-expand"><div class=""></div></div><div class="chartjs-size-monitor-shrink"><div class=""></div></div></div>-->
<!--                 <canvas id="stackedBarChart" style="min-height: 250px; height: 250px; max-height: 250px; max-width: 100%; display: block; width: 444px;" width="444" height="250" class="chartjs-render-monitor"></canvas>-->
<!--               </div>-->
<!--             </div>-->
<!--             &lt;!&ndash; /.card-body &ndash;&gt;-->
<!--           </div>-->
<!--           &lt;!&ndash; /.card &ndash;&gt;-->

<!--         </div>-->
<!--         &lt;!&ndash; /.col (RIGHT) &ndash;&gt;-->
<!--       </div>-->
       </section>
       <!--      .container-->
    </div>
<!--      content-->
    </div>
    <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->

  <!-- Control Sidebar -->
  <aside class="control-sidebar control-sidebar-dark">
    <!-- Control sidebar content goes here -->
    <div class="p-3">
      <h5>Title</h5>
      <p>Sidebar content</p>
    </div>
  </aside>
  <!-- /.control-sidebar -->

  <!-- Main Footer -->
  <footer class="main-footer">
    <!-- To the right -->
    <div class="float-right d-none d-sm-inline">
      Anything you want
    </div>
    <!-- Default to the left -->
    <strong>Copyright &copy; -2030 <a href="#">济南格林信息科技有限公司</a>.</strong> All rights reserved.
  </footer>
</div>
<!-- ./wrapper -->

<!-- REQUIRED SCRIPTS -->

<!-- jQuery -->
<script src="plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- AdminLTE App -->
<script src="plugins/chart.js/Chart.min.js"></script>
<script src="dist/js/adminlte.min.js"></script>
<!-- FLOT CHARTS -->
<script src="plugins/flot/jquery.flot.js"></script>
<!-- FLOT RESIZE 插件 - 允许在调整窗口大小时重新绘制图表 -->
<script src="plugins/flot/plugins/jquery.flot.resize.js"></script>
<!-- FLOT PIE 插件 - 也用于绘制环形图 -->
<script src="plugins/flot/plugins/jquery.flot.pie.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="dist/js/zhfw.js"></script>
<script src="dist/js/demo-flot.js"></script>
<script>
  $('.carousel').carousel();
</script>
</body>
</html>
